
import { useState } from 'react';

// use打头的函数,封装逻辑和复用
const useAddCount = () => {
  const [count, setCount] = useState(0);
  const handleClick = () => {
    setCount(count + 1)
  }
  return {
    count,
    handleClick
  }
}

const A = () => {
  const { count, handleClick } = useAddCount();
  return (
    <div>
      <p>{count}</p>
      <button onClick={handleClick}>自定义Hooks</button>
    </div>
  )
}

const App = () => {
  const { count, handleClick } = useAddCount();
  return (
    <div>
      <p>{count}</p>
      <button onClick={handleClick}>自定义Hooks</button>
      <A></A>
    </div>
  )
};

export default App;
